import React from 'react';
import ImageLazy from '../../commons/ImageLazy';
import NavLink from '../../commons/NavLink';
import {hashHistory } from 'react-router'
import {getHosImg,getDocImg,getServImg} from '../../../actions/ActionTypes';

const user_dele = require('!url?limit=8192&name=static/img/[hash:6].[ext]!../../../static/img/user_dele.png');

let apply_refund = () => {
  let a = confirm('您确定要申请退款？');
  if(a){
    hashHistory.push('/user/applyRefund')
  }
}

export default React.createClass({
  componentDidMount:function(){
    // console.log(this.props.params)
  },

  filterSome(a,b,c,d,e){
    d.forEach(function(item,index){
      if(item.orderState == e){
          a.push(item)
        }
    })
    a.forEach(function(item,index){
      if(b[item.unionSN]){
        b[item.unionSN].push(item)
      }else{
        b[item.unionSN] = [];
        b[item.unionSN].push(item)
      }
    })
    for(var i in b){
      c.push(i)
    }
  },
  pending:function(pending_arr_obj,pending_arr_obj_sn,callback){
    return pending_arr_obj_sn.map(function(itema,indexa){
      return(
        <div>
          {
            pending_arr_obj[itema].map(function(item,index){
              let imgSrc = getServImg(item.itemImage,'_200_200',item.hospitalId,item.itemId);
                return(
                  <NavLink to="/user/order/detail" className="item border_b1">
                    <div className="wrapper clearfix">
                      <em className="checks"><var></var></em>
                      <h4>{item.itemName}·{item.itemClass}</h4>
                      <div className="mid">
                        {/* <ImageLazy src="https://dummyimage.com/120x120/b293a4/fff" style={{height:"1.2rem"}}  /> */}
                        <em style={{"background-image":"url("+ imgSrc + ")"}}></em>
                        <div>
                          医院：？？<br/><br/>
                          包含：？？
                        </div>
                      </div>
                      <h5>预约金：¥ {item.itemPrice}</h5>
                      <div className="num">×{item.itemNum}</div>
                    </div>
                  </NavLink>
                )
            })
          }
          <div className="status border_b1">
            <div className="wrapper">
              <div className="left">◆ 等待付款<small>(剩余23小时自动关闭)</small></div>
              <div className="right">
                <NavLink to="/user/pay" className="pays">付款</NavLink>
              </div>
            </div>
          </div>
          {callback?callback():''}
        </div>
      )
    })
  },
  consumed:function(consumed_arr){
    let _this = this;
    return consumed_arr.map(function(item,index){
      let imgSrc = getServImg(item.itemImage,'_200_200',item.hospitalId,item.itemId);
      return(
        <div>
          <NavLink to="/user/order/detail" className="item border_b1">
            <div className="wrapper clearfix">
              <em className="checks"><var></var></em>
              <h4>{item.itemName}·{item.itemClass}</h4>
              <div className="mid">
                {/* <ImageLazy src="https://dummyimage.com/120x120/b293a4/fff" style={{height:"1.2rem"}}  /> */}
                <em style={{"background-image":"url("+ imgSrc + ")"}}></em>
                <div>
                  医院：？？<br/><br/>
                  包含：？？
                </div>
              </div>
              <h5>预约金：¥ {item.itemPrice}</h5>
              <div className="num">×{item.itemNum}</div>
            </div>
          </NavLink>
          <div className="status border_b1">
            <div className="order_number border_b1"><span>订单编号</span><em>{item.orderSN}</em></div>
            <div className="wrapper">
              <div className="left"></div>
              <div className="right">
                <a href="javascript:void(0)" className="pays" onClick={apply_refund}>申请退款</a>
                <a href={"tel:" + item.doctorMobile} className="pays">联系医生</a>
              </div>
            </div>
          </div>
        </div>
      )
    })
  },
  render:function(){
    let allorder = this.props.allorder || [],
        path = this.props.path,
        _this = this,
        pending_arr = [],
        pending_arr_obj = [],
        pending_arr_obj_sn = [],
        consumed_arr = [],
        unconsumed_arr = [],
        unconsumed_arr_obj = [],
        unconsumed_arr_obj_sn = [];

    this.filterSome(pending_arr,pending_arr_obj,pending_arr_obj_sn,allorder,'1');
    // this.filterSome(consumed_arr,consumed_arr_obj,consumed_arr_obj_sn,allorder,'3');
    allorder.forEach(function(item,index){
      if(item.orderState == 3){
          consumed_arr.push(item)
      }
    })
    var show_inner;
    if(path == "all"){
      show_inner = function(){
        return _this.pending(pending_arr_obj,pending_arr_obj_sn,function(){
          // return _this.consumed(consumed_arr)
        })
      }
    }
    console.log(show_inner)
    return(
      <div className="userOrder_classify">
        <div className="item_wrapper">
        {
          // _this.pending(pending_arr_obj,pending_arr_obj_sn)
          show_inner()
          // console.log(path == 'all')
          // if(path == 'all'){
          //     // _this.pending(pending_arr,pending_arr_obj,pending_arr_obj_sn)
          //     // _this.consumed(consumed_arr)
          // }
        }


          {/* <div className="status border_b1">
            <div className="wrapper">
              <div className="left">◆ 已失效</div>
              <div className="right">
              </div>
            </div>
          </div>
          <div className="status border_b1">
            <div className="order_number border_b1"><span>订单编号</span><em>2016789023</em></div>
            <div className="wrapper">
              <div className="left"></div>
              <div className="right">
                <a href="javascript:void(0)" className="pays" onClick={this.apply_refund}>申请退款</a>
                <a href="javascript:void(0)" className="pays">联系医生</a>
              </div>
            </div>
          </div>
          <div className="status border_b1">
            <div className="wrapper">
              <div className="left">◆ 退款成功</div>
              <div className="right">退款金额：¥ 231
              </div>
            </div>
          </div>
          <div className="status border_b1">
            <div className="wrapper">
              <div className="left">◆ 已消费<small>(消费时间2016.11.25)</small></div>
              <div className="right">
              </div>
            </div>
          </div> */}
        </div>
      </div>
    )
  }
})
